/*
 * @Descripttion: 
 * @version: 
 * @Author: Indolphin
 * @Date: 2021-03-18 22:39:47
 * @LastEditors: Indolphin
 * @LastEditTime: 2021-03-19 23:25:06
 */
import React, { Component } from 'react';
import { Card, Input, Table, Popconfirm, Divider, Button } from 'antd';
import {
    PlusOutlined
  } from '@ant-design/icons';
import './User.less';


interface IProps {

}

interface IState {
    dataSource: any
}

class User extends Component<IProps, IState> {

    columns: any;

    constructor(props: IProps) {
        super(props);

        this.state = {
            dataSource: [{
                index: 1,
                username: '管理员',
                identification: 'admin',
                role: '系统管理员'
            }]
        }

        this.columns = [
            {
                key: 'index',
                title: '序号',
                dataIndex: 'index'
            }, {
                key: 'identification',
                title: '用户标识',
                dataIndex: 'identification'
            }, {
                key: 'username',
                title: '用户名',
                dataIndex: 'username'
            }, {
                key: 'role',
                title: '角色',
                dataIndex: 'role'
            }, {
                key: 'createTime',
                title: '创建日期',
                dataIndex: 'createTime'
            }, {
                key: 'updateTime',
                title: '更新日期',
                dataIndex: 'updateTime'
            }, {
                title: '操作',
                dataIndex: 'operation',
                render: (_: any, record: { key: React.Key }) =>
                  this.state.dataSource.length >= 1 ? (
                    <div>
                        <a>编辑</a>
                        <Divider type="vertical" />
                        <Popconfirm title="确定要删除吗?" onConfirm={() => {}}>
                            <a>删除</a>
                        </Popconfirm>
                    </div>
                  ) : null,
            }
        ];
    }

    render() {
        return (
       
                <Card 
                    title={
                        <Input style={{width: 200}}/>
                    } 
                    extra={
                        <a>
                            <PlusOutlined />
                        </a>
                    }>
                    <Table columns={this.columns} dataSource={this.state.dataSource} />
                </Card>
    
        );
    }
}

export default User;